<template>
	<div class="aieditor-container">
		<el-card shadow="hover" class="h100">
            <AiEditor :config="editor.config"></AiEditor>
        </el-card>
    </div>
</template>
<script lang="ts">
import { ref, toRefs, reactive, onMounted, getCurrentInstance } from 'vue';
import AiEditor from '/@/components/aieditor/index.vue';
import { getSparkChatInfo } from '/@/api/ai/index';
export default {
	name: 'pages/aieditor',
	components: { AiEditor },
	setup() {
        const state = reactive({
            editor: {
                config: {
                    placeholder: "点击输入内容...",
                    contentRetention: true,
                    content: 'AiEditor 是一个面向 AI 的开源富文本编辑器。 ',
                    ai: {
                        model: {
                            xinghuo:{
                                appId: '',
                                version: "v1.1",
                                urlSignatureAlgorithm: null,
                            }
                        },
                        bubblePanelEnable: true,
                        bubblePanelModel: "xinghuo",
                    },
                }
            }
        });
        onMounted(() => {
            getSparkChatInfo().then(res => {
                if(res.code === 0){
                    state.editor.config.ai.model.xinghuo.appId = res.data.appId;
                    state.editor.config.ai.model.xinghuo.version = res.data.version;
                    state.editor.config.ai.model.xinghuo.urlSignatureAlgorithm = (model) => {
                        return res.data.url;
                    };
                }
            })
        })

        return {
			...toRefs(state),
		};
    }
};
</script>
